<template>
    <div class="jx-index">
        
        <main>
            <section class="banner">
                <van-swipe :autoplay="3000">
                    <van-swipe-item>
                        <a href="#"><img src="/static/img/slide01.jpg"></a>
                    </van-swipe-item>
                    <van-swipe-item>
                        <a href="#"><img src="../../../assets/img/slide02.jpg"></a>
                    </van-swipe-item>
                    <van-swipe-item>
                        <a href="#"><img src="../../../assets/img/slide03.jpg"></a>
                    </van-swipe-item>
                </van-swipe>
            </section>


            <van-tabbar class="navbar van-tabbar--static" >
                <van-tabbar-item to='/topic' icon="wap-home">话题</van-tabbar-item>
                <van-tabbar-item to='/symposium' icon="points">专题</van-tabbar-item>
                <van-tabbar-item to='/article' icon="shop" >文章</van-tabbar-item>
                <van-tabbar-item to='/Authentication' icon="contact">认证号</van-tabbar-item>
            </van-tabbar>
           
            <!-- <van-list v-model="loading" :finished="finished" @load="onLoad" >
                <van-cell v-for="item in list" :key="item" :title="item + ''" />
            </van-list> -->
            <section v-for="(item, index) in dtitems" :key="index">
                <dt-item :info="item"></dt-item>
            </section>
            
        </main>

    </div>
</template>

<script>
    
    import DtItem from '@/components/DtItem';

    export default {
        data () {
            return {
                list: [],
                loading: false,
                finished: false,

                dtitems: [
                    {
                        id: 151151215121651,
                        message: '一本正经的拍照，然而眼睛哪去啦？', // 文本信息
                        img: '/static/img/home/dtList/dt001.jpg', // 封面图片
                        imgCount: 4, // 动态的图片总数
                        likes: {
                            isLike: false, // 是否点赞
                            count: 130, // 点赞数量
                            users: [
                                {
                                    id: 454115, // 用于跳转拼接
                                    isV: false, // 是否加 V 认证（实名认证）
                                    avatar: '/static/img/home/userAvatar/user002.png'
                                },
                                {
                                    id: 548445,
                                    isV: true,
                                    avatar: '/static/img/home/userAvatar/user003.jpg'
                                },
                                {
                                    id: 451512,
                                    isV: true,
                                    avatar: '/static/img/home/userAvatar/user004.jpg'
                                }
                            ]
                        },
                        comments: {
                            count: 28,
                            detail: [
                                {
                                    userId: 151431,
                                    userName: '游客1542',
                                    message: '真可爱/c256',
                                    isReply: true, // 当前评论是否是回复其他评论
                                    replyUserName: '戴假发', // 被回复的用户名（当 isReply 为 flase 时，值为空）
                                    replyUserId: '456421' // 被回复的用户ID（当 isReply 为 flase 时，值为空）
                                },
                                {
                                    userId: 4564112,
                                    userName: '米亚',
                                    message: '交个朋友吧',
                                    isReply: false,
                                    replyUserName: '',
                                    replyUserId: ''
                                },
                                {
                                    userId: 563184,
                                    userName: '西门懒得吹雪',
                                    message: '酷儿',
                                    isReply: false,
                                    replyUserName: '',
                                    replyUserId: ''
                                },
                            ]
                        },
                        user: { // 用户信息
                            id: 153145142,
                            name: '颖宝宝',
                            sex: '女',
                            isV: false, // 是否加 V 认证（实名认证）
                            avatar: '/static/img/home/userAvatar/user001.jpg',
                            isFollow: false, // 是否关注
                            address: {
                                province: '广东',
                                city: '深圳',
                            }
                        },
                        pet: { // 宠物信息
                            id: 356244,
                            name: '肥妹',
                            sex: '母', // 公：#98b5f1， ，母： #f1989e
                            avatar: '/static/img/home/petAvatar/pet005.jpg',
                            variety: '贵宾犬'
                        }
                    }
                ]
            }
        },

        components: {
            DtItem 
        },

        methods: {
            // onLoad() {
            //     setTimeout(() => {
            //         for (let i = 0; i < 10; i++) {
            //             this.list.push(this.list.length + 1);
            //         }
            //         this.loading = false;

            //         if (this.list.length >= 100) {
            //             this.finished = true;
            //         }
            //     }, 500);
            // }
        },

        

    }


</script>


<style scoped>
    main {
        background: #f1f1f1;
    }
    .banner {
        max-height: 160px;
        overflow: hidden;
    }
    .banner img {
        width: 100%;
    }
    .van-tabbar--static {
        position: static;
    }

</style>